var pageDataIdMap;
var idMap = new Map();
layui.use(['table', 'layer'], function () {
    // var table = layui.table;
    var layer = layui.layer;
    var table = layui.table
        , form = layui.form
        , $ = layui.$;


    table.render({
        elem: '#test'
        , url: '/list'
        , toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板

        //filter,exports,print
        , defaultToolbar: ['', '', ''
        ]
        , title: '用户数据表'
        , cols: [[
            {type: 'checkbox', fixed: 'left', style: 'height:150px'}
            // , {type: 'numbers', title: '序号', width: 60, fixed: 'left', unresize: true}不使用主键显示序号
            , {field: 'studentId', title: '学生ID', width: 73, fixed: 'left', unresize: true}
            , {field: 'name', title: '姓名', width: 90}
            , {field: 'age', title: '年龄', width: 60}
            , {field: 'grade', title: '年级', width: 80}
            , {field: 'department', title: '院系', width: 100}
            , {field: 'major', title: '专业'}
            , {field: 'sex', title: '性别', width: 60}
            , {field: 'nation', title: '民族', width: 60}
            , {field: 'idCard', title: '身份证', width: 120}
            , {field: 'schooling', title: '学制', width: 80}
            , {field: 'phone', title: '手机', width: 120}
            , {
                field: 'picture',
                title: '照片',
                templet: '<div><img  src="{{d.picture}}"  style="width: 100px;height: 138px"/></div>',
                width: 110,
                style: 'height:140px'
            }
            , {field: 'pay', title: '缴费状态', width: 120}
            , {field: 'start', title: '报名状态', width: 120}
            , {field: 'createTime', title: '创建时间'}
            , {fixed: 'right', title: '操作', toolbar: '#barDemo', width: 180, style: 'height:150px'}
        ]]
        , page: true
        , id: 'test'
        , height: 'full-150'
        , limits: [1, 2, 3, 4, 5, 10, 20, 30, 40, 50]
        , limit: 3
        , done: function (res, curr, count) {
            var len = res.data.length;
            pageDataIdMap = new Map();
            for (var i = 0; i < len; i++) {   //填充当前页的数据
                pageDataIdMap[res.data[i].studentId] = res.data[i].studentId;
            }
            var chooseNum = 0;   //记录当前页选中的数据行数
            for (var i = 0; i < len; i++) {   //勾选行回显
                for (var key in idMap) {
                    if (res.data[i].studentId == key) {
                        res.data[i]["LAY_CHECKED"] = 'true';
                        //找到对应数据改变勾选样式，呈现出选中效果
                        var index = res.data[i]['LAY_TABLE_INDEX'];
                        $('tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
                        $('tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
                        chooseNum++;
                    }
                }
            }
            if (len != 0 && chooseNum == len) {   //表示该页全选  --  全选按钮样式回显
                $('input[lay-filter="layTableAllChoose"]').prop('checked', true);
                $('input[lay-filter="layTableAllChoose"]').next().addClass('layui-form-checked');
            }

            console.log(res);
            //得到当前页码
            console.log(curr);
            //得到数据总量
            console.log(count);

        }

    });


    table.on('checkbox(test)', function (obj) {
        const checkStatus = table.checkStatus('test'); //idTest 即为基础参数 id 对应的值
        if (obj.type == 'one') {    //单选操作
            if (obj.checked) {     //选中
                idMap[obj.data.studentId] = obj.data.studentId;
            } else {      //取消选中
                for (var key in idMap) {
                    if (key == obj.data.studentId) {   //移除取消选中的id
                        delete idMap[obj.data.studentId];
                    }
                }
            }
        } else {      //全选操作
            if (obj.checked) {    //选中
                for (var pageKey in pageDataIdMap) {
                    idMap[pageKey] = pageKey;
                }
            } else {     //取消选中
                for (var pageKey in pageDataIdMap) {
                    for (var key in idMap) {
                        if (key == pageKey) {
                            delete idMap[pageKey];
                        }
                    }
                }
            }
        }


        console.log("checkStatus ↓"); //获取选中行的数据
        console.log(checkStatus); //获取选中行的数据
        console.log("checkStatus.data ↓"); //获取选中行的数据
        console.log(checkStatus.data) //获取选中行的数据
        console.log("checkStatus.data.length ↓"); //获取选中行的数据
        console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
        console.log("checkStatus.isAll ↓"); //获取选中行的数据
        console.log(checkStatus.isAll) //表格是否全选

        console.log("obj.data != null ↓");
        console.log(obj.data != null);
        console.log("obj.checked. ↓ ↓")
        console.log(obj.checked)
        console.log("obj.data ↓ ↓")
        console.log(obj.data)
        console.log("obj.type ↓ ↓")
        //all时上面拿不到数据要        console.log(checkStatus.data)
        console.log(obj.type)


    });


//头工具栏事件
    table.on('toolbar(test)', function (obj) {

        var checkStatus = table.checkStatus(obj.config.id);
        switch (obj.event) {
            case 'getCheckData':
                var data = checkStatus.data;
                console.log(JSON.stringify(data))
                $.ajax({
                    url: '/deletes',
                    type: 'post',
                    data: JSON.stringify(data),
                    dataType: 'json',
                    contentType: 'application/json;charset=UTF-8',
                    success: function (data) {
                        if (data.code == 0) {
                            $(".layui-laypage-btn").trigger("click");
                        }
                    },
                    error: function (error) {
                        console.log(error)
                    }
                });
                // layer.alert(JSON.stringify(data));
                break;
            case 'getCheckLength':
                // 导出选中

                var ids = "";
                for (var key in idMap) {
                    ids += key + ",";
                }
                ids = ids.slice(0, -1);
                console.log(ids);

                if (ids.length == 0) {
                    layer.msg("请选择");
                    break;
                }
                window.location.href = '/exportSome?studentId=' + ids;
                break;
            case 'isAll':

                var ids = "";
                for (var key in idMap) {
                    ids += key + ",";
                }
                ids = ids.slice(0, -1);
                console.log(ids);

                $.ajax({
                    type: "POST",
                    url: 'deletearr',
                    data: {
                        ids: ids
                    },
                    dataType: "json",
                    success: function (data) {
                        if (data.code == 0) {
                            $(".layui-laypage-btn").trigger("click");
                        } else {
                            layer.msg("请选择");
                            // layer.msg(data.msg);
                        }
                    }
                })


                break;
            //自定义头工具栏右侧图标 - 提示
            case 'LAYTABLE_TIPS'
            :
                layer.alert('这是工具栏右侧自定义的一个图标按钮');
                break;
        }

    });


//监听行工具事件
    table.on('tool(test)', function (obj) {
        var data = obj.data;
        if (obj.event === 'del') {
            layer.confirm('真的删除行么', function (index) {
                obj.del();
                layer.close(index);
                console.log(obj.data);
                console.log(index);
                $.ajax({
                    url: '/deleteone',
                    type: 'get',
                    data: {studentId: obj.data.studentId},
                    dataType: 'json',
                    success: function (data) {
                        if (data.code == 0) {
                            $(".layui-laypage-btn").trigger("click");
                        }
                    },
                    error: function (error) {
                        console.log(error)
                    }
                });

            });
        } else if (obj.event === 'edit') {
            console.log(obj.data);
            layer.open({
                type: 2,
                title: '添加或编辑',
                maxmin: true,
                shadeClose: true, //点击遮罩关w闭层
                area: ['1400px', '350px'],
                content: '/edit?studentId=' + obj.data.studentId,
                cancel: function () {
                    $(".layui-laypage-btn").trigger("click");
                    //return false 开启该代码可禁止点击该按钮关闭
                },
                end: function () {
                    //z在弹出层的按钮提交后
                    // 成功执行 var index = parent.layer.getFrameIndex(window.name);
                    //                         setTimeout(function(){parent.layer.close(index)}, 700);
                    $(".layui-laypage-btn").trigger("click");
                }
            });

        } else if (obj.event === 'up') {
            // obj.data.studentId;
            layer.open({
                type: 2,
                title: '上传图片',
                maxmin: true,
                shadeClose: true, //点击遮罩关w闭层
                area: ['400px', '400px'],
                content: "/up?studentId=" + obj.data.studentId,
                cancel: function () {
                    //cancel是自己点击关闭触发
                    $(".layui-laypage-btn").trigger("click");
                    // window.location.reload();
                    //return false 开启该代码可禁止点击该按钮关闭
                },
                end: function () {
                    //这是弹出层自己代码close触发
                    $(".layui-laypage-btn").trigger("click");

                }
            });
        } else if (obj.event === 'delpic') {
        }
    });

});

layui.use('upload', function () {
    var $ = layui.jquery
        , upload = layui.upload;
    //选完文件后不自动上传
    upload.render({
        elem: '#test8'
        , url: '/upExcel' //改成您自己的上传接口
        , auto: false
        , accept: 'file'
        , exts: 'xlsx|xls'
        , size: 800
        //,multiple: true
        , bindAction: '#test9'
        , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
            //0,1,2对应不同加载样式
            layer.load(); //上传loading
        }
        , done: function (res) {
            if (res.code == 0) {
                //关闭loading
                layer.closeAll('loading');


                var table = layui.table;
                // table.reload('test', {
                //     url: '/list'
                //     , where: {} //设定异步数据接口的额外参数
                //     , page: {
                //         curr: 1 //重新从第 1 页开始
                //     }
                // });

                layer.open({
                    title: '注意'
                    , content: res.msg
                });

                // $('.layui-laypage-btn').trigger("click");
                $('#clean').trigger("click");

            } else {
                layer.msg('上传出错');
            }
            console.log(res)
        }
    });
});
